<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ page contentType="text/html;charset=utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:wb="http://open.weibo.com/wb">
<head>
<title>关键词搜索统计线图</title>
<script>
		$(document).ready(function() {
			
			$("#searchReportGroupDayLineChart").addClass("active");
			var chartTitle = '${chartsModel.title}';
			var chartSubTitle = '${chartsModel.subTitle}';
			var chartCategories = ${chartsModel.categories};
			var chartSeries = ${chartsModel.series};
			 $('#keywordReportGroupDayLineChart').highcharts({
		            chart: {
		                type: 'spline'//图表类型
		            },
		            title: {
		                text: chartTitle//团表主标题
		            },
		            subtitle: {
		                text: chartSubTitle//图表子标题
		            },
		            xAxis: {
		            	//X轴坐标点
		                categories: chartCategories
		            },
		            yAxis: {
		                title: {
		                    text: '搜索次数'//Y轴坐标点 名称
		                },
		                labels: {
		                    formatter: function() {
		                        return this.value +'次'
		                    }
		                }
		            },
		            tooltip: {//提款
		                crosshairs: true,
		                shared: true
		            },
		            plotOptions: {
		                spline: {
		                    marker: {
		                        radius: 4,//Y数据点样式大小
		                        lineColor: '#666666',
		                        lineWidth: 1
		                    }
		                }
		            },
		            series: chartSeries
		        });
		});
</script>
</head>

<body>
	<h1 align="center">关键词搜索统计线图</h1>
	<c:if test="${not empty message}">
		<div id="message" class="alert alert-success"><button data-dismiss="alert" class="close">×</button>${message}</div>
	</c:if>

<form class="form-inline" action="/report/keywordReportGroupDay"  method="post">

				<c:set var="cityCode1" value="${cityCode}"></c:set>
			 	<label>城市：</label> 
			 		<select id="cityCode" name="cityCode" style="width: 100px">
						<c:forEach var="city" items="${citys}">
							<option value='<c:out value="${city.id}"/>'
								<c:if test="${city.id==cityCode1}">selected</c:if> 
							><c:out value="${city.name}"/></option>
						</c:forEach>
					</select>
	
<label>分类： 
				<c:set var="assortCode" value="${assort}"></c:set>
				<select id="assort" name="assort">   
					<option value="0" >无分类</option>
					<c:forEach var="assort" items="${assorts}">
						<option value='<c:out value="${assort.id}"/>'
							<c:if test="${assort.id==assortCode}">selected</c:if> 
						><c:out value="${assort.name}"/></option>
					</c:forEach>
				</select>
			</label>


<label>关键词：</label> <input id="keyword", name="keyword" class="input-large"  value="${keyword}"/>	  	
	<div class="row">
		<label style="padding-left: 20px;">
			时间段(yyyy-MM-dd):
		</label>
		<input id="beginDate", name="beginDate" class="input"  value="${beginDate}"/>
		-
		<input id="endDate", name="endDate" class="input"  value="${endDate}"/>
	</div>
	<div class="row" align="center">
		<label style="padding-left: 20px;">
		  <button type="submit" class="btn btn-primary " id="search_btn">查询</button>
		</label>
	</div>

</form>	
<div id="keywordReportGroupDayLineChart" class="row" style="padding-left: 20px;"></div>
</body>
</html>